import { AntdModalProps } from '@/hooks/useAntdModal';
import { saveImage } from '@/service/internal';
import { baseURL } from '@/utils/request';
import { Button, Form, Input, Modal, Select, Switch, Upload, message } from 'antd';
import React from 'react';
const UploadImage = ({ modalProps,closeModal,refresh, form }: AntdModalProps) => {
  const onChange = (e) => {
    if (e.file.response?.code === 200) {
      form.setFieldValue('url', e.file.response.data.url)
    }
    console.log('333', { e })
  }
  const onOk = async () => {
    const data =await form.validateFields()
    
    if(Array.isArray(data.tags)){
      data.tags = data.tags.join(',')
    }
    const res =await saveImage(data)
    message.success('保存成功')
    refresh()
    closeModal()
  }
  return (<Modal {...modalProps} onOk={onOk}>

    <Form form={form}>
      <Form.Item name='_id' hidden/>
      <Form.Item label="图片" name='url1'>
        <Upload action={baseURL + '/internal/mp/uploadFile'} onChange={onChange} listType='picture-card'>上传</Upload>
      </Form.Item>
      <Form.Item label="图片" name='url'>
        <Input />
      </Form.Item>
     
      <Form.Item label="标签" name='tags'>
        <Select mode='tags' options={[{
          label:'风景',
          value:'风景'
        },{
          label:'汽车',
          value:'汽车'
        },{
          label:'美食',
          value:'美食'
        },{
          label:'星空',
          value:'星空'
        },{
          label:'动物',
          value:'动物'
        },{
          label:'祝福',
          value:'祝福'
        }]} />
      </Form.Item>
      <Form.Item label='来源' name='source'>
        <Select options={[{
          label:'www.pexels.com',
          value:'www.pexels.com'
        }]} />
      </Form.Item>
      <Form.Item label='推荐' name='best'>
        <Switch />
      </Form.Item>
    </Form>
  </Modal>)
}
export default UploadImage